import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import 'package:zenge_web_flutter/custom/appBar_widget.dart';
import 'package:zenge_web_flutter/custom/custom_products_view.dart';
import 'package:zenge_web_flutter/custom/custom_title.dart';
import 'package:zenge_web_flutter/custom/custom_widget.dart';
import 'package:zenge_web_flutter/date_base/drive_module_date.dart';
import 'package:zenge_web_flutter/date_base/illumination_products_date.dart';
import 'package:zenge_web_flutter/view/keep_alive.dart';
import 'action.dart';
import 'state.dart';


Widget buildView(DriveModuleState state, Dispatch dispatch,
    ViewService viewService) {
  double screenWidth = 1920;
  double screenHeight =
      (650 / 1920) * 1920;
  return Scaffold(
    body: Container(
      width: MediaQuery.of(viewService.context).size.width,
      alignment: Alignment.center,
      child: Container(
        width: screenWidth,
        alignment: Alignment.center,
        child: ListView(
          shrinkWrap: true,
          controller: state.scrollController,
          children: [
            Stack(
              children: [
                Positioned(
                  top: 65,
                  child: Container(
                    width: screenWidth,
                    height: 250/1920*screenWidth,
                    child: new Image.network(
                      'http://nwzimg.wezhan.hk/contents/sitefiles3603/18018508/images/2237665.jpg',
                      fit: BoxFit.fill,
                    ),
                  ),
                ),
                AppBarWidget(boxHeight: 380,),
              ],
            ),

            SizedBox(
              height: screenWidth / 30,
            ),
            CustomTitle(
              text: '蓝牙组网模块',
              width: screenWidth,
              textSize: 40,
            ),
            Container(
              width: screenWidth * 7 / 10,
              height: 1050,
              child: Stack(
                children: [
                  Positioned(
                    top: 0,
                    left: (screenWidth-screenWidth * 7 / 10)/2,
                    child: Container(
                      width: screenWidth * 7 / 10,
                      child: GridView.builder(
                          shrinkWrap: true,
                          itemCount: bluetoothNetworkingList.length,
                          padding: EdgeInsets.all(10),
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 3,
                            crossAxisSpacing: 10,
                            mainAxisSpacing: 10, childAspectRatio: 308/358,
                          ),
                          itemBuilder: (BuildContext context, int index) {
                            return ProductsView(
                              width: screenHeight / 5,
                              text: bluetoothNetworkingList[index].text01,
                              image01: bluetoothNetworkingList[index].image1,
                              image02: bluetoothNetworkingList[index].image2,
                            );
                          }),
                    ),
                  ),
                ],
              ),
            ),
            SizedBox(
              height: screenWidth / 30,
            ),
            CustomTitle(
              text: 'WIFI模块',
              width: screenWidth,
              textSize: 40,
            ),
            Container(
              width: screenWidth * 7 / 10,
              height: 550,
              child: Stack(
                children: [
                  Positioned(
                    top: 0,
                    left: (screenWidth-screenWidth * 7 / 10)/2,
                    child: Container(
                      width: screenWidth * 7 / 10,
                      child: GridView.builder(
                          shrinkWrap: true,
                          itemCount: wiFiList.length,
                          padding: EdgeInsets.all(10),
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 3,
                            crossAxisSpacing: 10,
                            mainAxisSpacing: 10, childAspectRatio: 308/358,
                          ),
                          itemBuilder: (BuildContext context, int index) {
                            return ProductsView(
                              width: screenHeight / 5,
                              text: wiFiList[index].text01,
                              image01: wiFiList[index].image1,
                              image02: wiFiList[index].image2,
                            );
                          }),
                    ),
                  ),
                ],
              ),
            ),
            SizedBox(
              height: screenWidth / 30,
            ),
            CustomTitle(
              text: '蓝牙组网驱动电源',
              width: screenWidth,
              textSize: 40,
            ),
            Container(
              width: screenWidth * 7 / 10,
              height: 1050,
              child: Stack(
                children: [
                  Positioned(
                    top: 0,
                    left: (screenWidth-screenWidth * 7 / 10)/2,
                    child: Container(
                      width: screenWidth * 7 / 10,
                      child: GridView.builder(
                          shrinkWrap: true,
                          itemCount: drivePowerList.length,
                          padding: EdgeInsets.all(10),
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 3,
                            crossAxisSpacing: 10,
                            mainAxisSpacing: 10, childAspectRatio: 308/358,
                          ),
                          itemBuilder: (BuildContext context, int index) {
                            return ProductsView(
                              width: screenHeight / 5,
                              text: drivePowerList[index].text01,
                              image01: drivePowerList[index].image1,
                              image02: drivePowerList[index].image2,
                            );
                          }),
                    ),
                  ),
                ],
              ),
            ),
            SizedBox(
              height: screenWidth / 30,
            ),
            Stack(
              children: [
                ImageWidget(
                  width: screenWidth,
                  height: 310 / 1920 * screenWidth,
                  imageUrl:
                  'http://nwzimg.wezhan.hk/contents/sitefiles3603/18018508/images/2038112.jpg',
                ),
                Positioned(
                  top: 20,
                  left: 0,
                  child: Container(
                    width: screenWidth,
                    color: Colors.white,
                    alignment: Alignment.center,
                    child: Text(
                      '支持以下智能化功能',
                      style: TextStyle(fontSize: 40, color: Colors.black),
                    ),
                  ),
                ),
              ],
            ),
            Stack(
              alignment: Alignment.center,
              children: [
                ImageWidget(
                  width: screenWidth,
                  height: 310 / 1920 * screenWidth,
                  imageUrl:
                  'http://nwzimg.wezhan.hk/contents/sitefiles3603/18018508/images/2038209.jpg',
                ),
                Positioned(
                  top: 20,
                  left: 0,
                  child: Container(
                    width: screenWidth,
                    color: Colors.white,
                    alignment: Alignment.center,
                    child: Text(
                      '第三方平台兼容',
                      style: TextStyle(fontSize: 40, color: Colors.black),
                    ),
                  ),
                ),
              ],
            ),
            Container(
              height: 60,
              color: Colors.white,
            ),
            KeepAliveWidget(viewService.buildComponent("bottom_info")),
          ],
        ),
      ),
    ),
      floatingActionButton: FloatingActionButton(
        backgroundColor: Colors.white,
        onPressed: () {
          // scrollController 通过 animateTo 方法滚动到某个具体高度
          // duration 表示动画的时长，curve 表示动画的运行方式，flutter 在 Curves 提供了许多方式
          state.scrollController.animateTo(0.0,
              duration: Duration(milliseconds: 500),
              curve: Curves.decelerate);
        },
        child: Icon(Icons.arrow_upward_sharp,color: Colors.grey,size: 40,),
      )
  );
}